import { Component } from "solid-js";
import style from "../App.module.scss";

interface UsageTipProps {
  onClose: () => void;
}

const UsageTip: Component<UsageTipProps> = (props) => {
  return (
    <div class={style.usageTip}>
      <div class={style.usageTipContent}>
        <h2>使用说明</h2>
        <p>1. 选择计时模式：通过下拉菜单选择正计时、倒计时、当前时间或指定定时模式。</p>
        <p>2. 设置时间：在倒计时或指定定时模式下，可通过输入框设置时间。</p>
        <p>3. 操作按钮：使用“开始”、“暂停”和“重置”按钮控制计时。</p>
        <p>4. 快捷键：按空格键可以快速开始或暂停计时。</p>
        <button onClick={props.onClose}>关闭</button>
      </div>
    </div>
  );
};

export default UsageTip;


